<template>
	<view class="lay">
		<view class="user-info">
			<!-- 卡片 -->
			<uni-card>
				<view class="user-name">
					{{user.userName}}
					<button @click="navTo('/pages/user/edit-user-data')" class="edi-info"> <u-icon name="edit-pen" color="#a8a8a8" size="18" ></u-icon> 编辑资料</button>
				</view>
					
				<view v-if="true" class="school-auth">
					<button class="school" @click="getSchool()">{{school===null?'未认证':school}} &nbsp;></button>
					<button class="auth" v-if="school===null? false:true"><uni-icons type="auth-filled" color="#00ff00"></uni-icons>高级认证</button>
					<button class="common-auth">标准版</button>
				</view>
				<view class="my-status">
					<button class="status"><uni-icons type="plusempty" color="#adadad"></uni-icons>状态...</button>
				</view>
			</uni-card>
			<!-- 头像 -->
			<u-avatar
				size="60"
				:text="getAvatar(user)"
				shape="square" 
				bg-color="#0080FF"
				font-size='20'
				@click="navToUserInfo('/pages/book/addNewFriend/user-info',user.id)"
				:src="user.avaUrl">
			</u-avatar>
		</view>
		<view class="user-dynamic">
			<uni-card>
				<u-cell-group :border="false">
					<u-cell 
					title="动态"
					:isLink="true"
					size="large"
					center
					@click="navTo('/pages/user/dynamic/index')"
					>
					<u-icon slot="icon" size="26" color="#55ff7d" name="moments-circel-fill"></u-icon>
					</u-cell>
					<u-cell
					title="钱包"
					:isLink="true"
					>
					<u-icon slot="icon" size="26" color="#0000ff" name="zhifubao-circle-fill"></u-icon>
					</u-cell>
					<u-cell
					title="收藏"
					:border="false"
					:isLink="true"
					@click="navTo('/pages/user/collection')"
					>
					<u-icon slot="icon" size="26" color="#ffaa00" name="star"></u-icon>
					</u-cell>
				</u-cell-group>
			</uni-card>
		</view>
		<view class="user-found">
			<uni-card>
				<u-cell-group :border="false">
					<u-cell
					title="客服与帮助"
					:isLink="true"
					>
						<u-icon slot="icon" size="26" color="#175cff" name="server-man"></u-icon>
					</u-cell>
					<u-cell
					title="设置与隐私"
					:isLink="true"
					:border="false"
					url="/pages/user/setting"
					>
						<u-icon slot="icon" size="26" color="#175cff" name="setting"></u-icon>
					</u-cell>
				</u-cell-group>
			</uni-card>
		</view>
			<u-toast ref="uToast"></u-toast>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				toast:{
					type:'default',
					title:'默认主题',
					message:'院校正在审核中...',
				},
				school:null,
				text:'',
				user:{
					id:0,
					userName:'陈健华',
					avaUrl:'',
					phone:'',
					sex:0,
					signature:'',
					email:'',
					password:'',
					status:false,
				}
			}
		},
		methods:{
			showToast(params) {
				this.$refs.uToast.show({
					...params,
				})
			},
			navToUserInfo(url,id){
				uni.navigateTo({
					url:url+'?id='+id
				})
			},
			getSchool(){
				if(this.school===null){
					uni.request({
						url:'http://localhost:8090/nailCampus/school/isApply',
						method:'GET',
						header:{
							"token":uni.getStorageSync("token")
						},
						success:res=>{
							if(res.data.data!=null){
								this.showToast(this.toast)
							}else{
								this.navTo('/pages/user/school/school-accreditation')
							}
						}
					})

				}else{
					this.navTo('/pages/user/school/school-card')
				}
			},
			navTo(url){
				uni.navigateTo({
					url:url
				})
			},
			getAvatar(user){
				if(user.avaUrl == null|| user.avaUrl.length == 0){
					this.text = user.userName.slice(-2);
				}else{
					this.text = null;
				}
				return this.text;
			}, 
		},
		onLoad(){
			this.user = uni.getStorageSync('user')
			uni.request({
				url:'http://localhost:8090/nailCampus/school/getSchool',
				method:'GET',
				header:{
					"token":uni.getStorageSync('token')
				},
				success:res=>{ 
					if(res.data.data!=null){
						this.school = res.data.data.schoolName
					}else{
						this.school = null
					}
				}
			})
		}
	}
</script>

<style scoped lang="less">
	.lay{
		margin-top: 30rpx;
		.user-info{
			margin-top: 180rpx;
			height: 300rpx;
			.user-name{
				margin-left: 170rpx;
				font-size: 40rpx;
				font-weight: 600;
				color: black;
				margin-top: 10rpx;
				.edi-info{
					margin-left: 20rpx;
					color:#a8a8a8 ;
					line-height: 40rpx;
					height: 40rpx;
					background-color: white;
					float: right;
					font-size: 20rpx;
					width: 120rpx;
					border-bottom: 1rpx solid #e8e8e8;
					::v-deep .u-icon{
						float: left;
						margin-top: 5rpx;
					}
				}
				.button-hover{
					color:#666;
					background-color: #cecece;
				}
				button{
					padding-bottom: 0rpx;
					padding-top: 0rpx;
					padding-left: 0rpx;
					padding-right: 0rpx;
				}
			}
			.school-auth{
				border-bottom: 1rpx solid #adadad;
				margin-top: 10rpx;
				height: 90rpx;
				.school{
					height: 40rpx;
					margin-top: 20rpx;
					float: left;
					color: #7f7f7f;
					border: none;
					line-height: 40rpx;
					font-size: 25rpx;
					font-weight: 550rpx;
					width: 170rpx;		
					background-color: white;
					}
				.school::after{
					border: none;
				}
				.auth{
					margin-left: 20rpx;
					color:#7f7f7f ;
					line-height: 30rpx;
					margin-top: 20rpx;
					height: 35rpx;
					background-color: white;
					float: left;
					font-size: 20rpx;
					width: 120rpx;
					border-bottom: 1rpx solid #e8e8e8;
				}
				.common-auth{
					float: left;
					margin-left: 10rpx;
					color:#7f7f7f ;
					line-height: 35rpx;
					margin-top: 20rpx;
					height: 35rpx;
					background-color: white;
					width: 80rpx;
					font-size: 20rpx;
					border-bottom: 1rpx solid #e8e8e8;
				}
				button{
					padding-left: 0rpx;
					padding-right: 0rpx;
				}
				.button-hover{
					color:#666;
					background-color: #cecece;
				}
			}
		.my-status{
			.status{
				color: #adadad;
				line-height: 40rpx;
				margin-top: 20rpx;
				height: 40rpx;
				font-size: 25rpx;
				float: left;
				width: 20%;
				background-color: white;
				
			}
			.status::after{
				border: none;
			}
			.status:active{
				color: #666;
			}
			button{
				padding-left: 0rpx;
				padding-right: 0rpx;
			}
		}
		
		/* #ifdef H5 */
		.u-avatar{
			position: absolute;
			top: -20px;
			left: 100rpx;
		}
		/* #endif */
		
		/* #ifdef MP */
		::v-deep.u-avatar{
			position: absolute;
			top: 150rpx;
			left: 100rpx;
		}
		/* #endif */
		
			::v-deep.uni-card{
				border-radius: 20rpx;
				height: 250rpx;
			}

		}
		.user-dynamic{
			margin-top: -50rpx;
			height: 350rpx;
			::v-deep.uni-card{
				border-radius: 20rpx;
			}
		}
		.user-found{
			margin-top: -50rpx;
			::v-deep.uni-card{
				border-radius: 20rpx;
			}
		}
	}
	
</style>